<!--项目申报书-->
<template>
  <el-form
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="100px"
      class="demo-ruleForm"
  >
    <el-form-item label="项目名称" prop="name">
      <el-input v-model="ruleForm.name"></el-input>
    </el-form-item>
    <el-form-item label="队伍名称" prop="team_name">
      <el-input v-model="ruleForm.team_name"></el-input>
    </el-form-item>
    <el-row>
      <el-col :span="8">
        <el-form-item label="队长姓名" prop="leader_name">
          <el-input v-model="ruleForm.leader_name"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="队长学号" prop="leader">
          <el-input v-model.number="ruleForm.leader"> </el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="队长系别" prop="major">
          <el-cascader
              ref="majors"
              v-model="ruleForm.major"
              :options="options"
              clearable
              placeholder="请选择您的系别"
          />
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="8">
        <el-form-item label="队员一姓名" prop="name1">
          <el-input v-model="ruleForm.name1"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="队员一学号" prop="member_1">
          <el-input v-model.number="ruleForm.member_1"> </el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="队员一系别" prop="major1">
          <el-cascader
              ref="majors"
              v-model="ruleForm.major1"
              :options="options"
              clearable
              placeholder="请选择您的系别"
          />
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="8">
        <el-form-item label="队员二姓名" prop="name2">
          <el-input v-model="ruleForm.name2"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="队员二学号" prop="member_2">
          <el-input v-model.number="ruleForm.member_2"> </el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="队员二系别" prop="major2">
          <el-cascader
              ref="majors"
              v-model="ruleForm.major2"
              :options="options"
              clearable
              placeholder="请选择您的系别"
          />
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="8">
        <el-form-item label="指导老师" prop="teacher_name">
          <el-input v-model="ruleForm.teacher_name"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="系别" prop="teacher_major">
           <el-select v-model="ruleForm.teacher_major" class="m-2" placeholder="Select" size="large">
             <el-option label="计算机系" value="8"></el-option>
             <el-option label="财经系" value="13"></el-option>
             <el-option label="电子系" value="10"></el-option>
             <el-option label="软件系" value="5"></el-option>
         </el-select>
        </el-form-item>
      </el-col>
    </el-row>
    <el-form-item label="项目背景及研究意义" prop="meaning">
      <el-input
          type="textarea"
          v-model="ruleForm.meaning"
          placeholder="可拆分为产品描述、用户群体、项目愿景、竞争对手等方面详细描述，不少于100字，但
不超过1000字。"
      ></el-input>
    </el-form-item>
    <el-form-item label="研究目标研究内容和拟解决的关键问题" prop="question">
      <el-input
          type="textarea"
          v-model="ruleForm.question"
          placeholder=""
      ></el-input>
    </el-form-item>

    <el-form-item label="本项目的创新之处" prop="innovations">
      <el-input
          type="textarea"
          v-model="ruleForm.innovations"
          placeholder=""
      ></el-input>
    </el-form-item>

    <el-form-item label="研究计划" prop="plan">
      <el-input
          type="textarea"
          v-model="ruleForm.plan"
          placeholder=""
      ></el-input>
    </el-form-item>

    <el-form-item label="预期研究成果" prop="gain">
      <el-input
          type="textarea"
          v-model="ruleForm.gain"
          placeholder=""
      ></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="apply">立即申报</el-button>
      <el-button @click="resetForm('ruleForm')">重置</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import axios from "axios";

export default {
  data() {
    //手机号码验证
    var checkPhone = (rule, value, callback) => {
      const phoneReg = /^1[3|4|5|7|8][0-9]{9}$/;
      if (!value) {
        return callback(new Error("电话号码不能为空"));
      }
      setTimeout(() => {
        if (!Number.isInteger(+value)) {
          callback(new Error("请输入数字值"));
        } else {
          if (phoneReg.test(value)) {
            callback();
          } else {
            callback(new Error("电话号码格式不正确"));
          }
        }
      }, 100);
    };
    return {
      options: [
        {
          //   软件工程系
          value: "",
          label: "软件工程系",
          children: [
            {
              value: "",
              label: "软件国际版",
            },
            {
              value: "",
              label: "电子与计算机工程",
            },
            {
              value: "",
              label: "互联网金融应用与开发",
            },
            {
              value: "",
              label: "软件开发方向",
            },
            {
              value: "",
              label: "软件测试技术方向",
            },
            {
              value: "",
              label: "数据科学与大数据技术",
            },
          ],
        },
        // 网络技术系
        {
          value: "wangluojishuxi",
          label: "网络技术系",
          children: [
            {
              value: "",
              label: "网络应用开发方向",
            },
            {
              value: "",
              label: "信息资源管理方向",
            },
            {
              value: "",
              label: "云计算技术与应用方向",
            },
            {
              value: "",
              label: "信息系统开发方向",
            },
            {
              value: "",
              label: "网络完全技术方向",
            },
            {
              value: "",
              label: "网络技术与管理",
            },
          ],
        },
        // 电子
        {
          value: "",
          label: "电子系",
          children: [
            {
              value: "",
              label: "电工程专业",
            },
            {
              value: "",
              label: "通工程专业",
            },
            {
              value: "",
              label: "智能科学与技术专业",
            },
            {
              value: "",
              label: "自动化专业",
            },
          ],
        },

        // 数码系
        {
          value: "",
          label: "数码系",
          children: [
            {
              value: "",
              label: "环境设计专业",
            },
            {
              value: "",
              label: "数字媒体艺术",
            },
            {
              value: "",
              label: "风景园林专业",
            },
            {
              value: "",
              label: "视觉传达专业",
            },
            {
              value: "",
              label: "产品设计",
            },
          ],
        },
        // 计算机
        {
          value: "",
          label: "计算机系",
          children: [
            {
              value: "",
              label: "计算机科学与技术",
            },
            {
              value: "",
              label: "物联网工程",
            },
          ],
        },
        // 游戏系
        {
          value: "",
          label: "游戏系",
          children: [
            {
              value: "",
              label: "数字媒体技术",
            },
            {
              value: "",
              label: "动画",
            },
            {
              value: "",
              label: "网络与新媒体",
            },
          ],
        },
        // 外语系
        {
          value: "",
          label: "外语系",
          children: [
            {
              value: "",
              label: "商务英语方向",
            },
            {
              value: "",
              label: "翻译方向",
            },
            {
              value: "",
              label: "商务日语",
            },
          ],
        },
        // 管理系
        {
          value: "",
          label: "管理系",
          children: [
            {
              value: "",
              label: "行政管理",
            },
            {
              value: "",
              label: "市场营销",
            },
            {
              value: "",
              label: "人力资源管理",
            },
            {
              value: "",
              label: "工商管理",
            },
            ,
            {
              value: "",
              label: "物流管理",
            },
          ],
        },
        // 财经系
        {
          value: "",
          label: "财经系",
          children: [
            {
              value: "",
              label: "国际经济与贸易",
            },
            {
              value: "",
              label: "电子商务",
            },
            {
              value: "",
              label: "财务管理",
            },
            {
              value: "",
              label: "会计学",
            },
          ],
        },
      ],
      ruleForm: {
        name: "",
        team_name: "",
        leader_name: "",
        leader: "",
        major: "",
        name1: "",
        member_1: "",
        major1: "",
        name2: "",
        member_2: "",
        major2: "",
        teacher_name:'',
        teacher_major:'',
        meaning: "",
        question: "",
        innovations: "",
        plan: "",
        gain: "",
      },
      item_id:'',
      rules: {
        name: [
          { required: true, message: "请输入项目名称", trigger: "blur" },
          { min: 2, max: 20, message: "长度在 2 到 20 个字符", trigger: "blur" },
        ],
        team_name: [
          { required: true, message: "请输入队伍名称", trigger: "blur" },
          { min: 2, max: 5, message: "长度在 2 到 5 个字符", trigger: "blur" },
        ],
        leader_name: [
          { required: true, message: "请输入队长名称", trigger: "blur" },
          { min: 2, max: 5, message: "长度在 2 到 5 个字符", trigger: "blur" },
        ],
        leader: [
          { required: true, message: "请输入队员一学号", trigger: "blur" },
          { min: 1000000000, max: 9999999999,type: 'number', message: "长度在10个字符", trigger: "blur" },
        ],
        // major:[
        //   { required: true, message: "请选择队长系别", trigger: "change" },
        // ],
        name1: [
          { required: true, message: "请输入队员一名称", trigger: "blur" },
          { min: 2, max: 5, message: "长度在 2 到 5 个字符", trigger: "blur" },
        ],
        member_1: [
          { required: true, message: "请输入队员一学号", trigger: "blur" },
          { min: 1000000000, max: 9999999999,type: 'number', message: "长度在10个字符", trigger: "blur" },
        ],
        // major1: [
        //   { required: true, message: "请输入队员一系别", trigger: "change" },
        // ],
        name2: [
          { required: true, message: "请输入队员二名称", trigger: "blur" },
          { min: 2, max: 5, message: "长度在 2 到 5 个字符", trigger: "blur" },
        ],
        member_2:[
          { required: true, message: "请输入队员二学号", trigger: "blur" },
          { min: 1000000000, max: 9999999999,type: 'number', message: "长度在10个字符", trigger: "blur" },
        ],
        // major2:[
        //   { required: true, message: "请选择队员二系别", trigger: "change" },
        // ],

        meaning:[
          { required: true, message: "请输入项目背景及研究意义", trigger: "blur" },
          { min: 1, max: 1000, message: "长度在 1 到 1000 个字符", trigger: "blur" },
        ],
        question:[
          { required: true, message: "请输入您的描述", trigger: "blur" },
          { min: 1, max: 1000, message: "长度在 1 到 1000 个字符", trigger: "blur" },
        ],
        innovations: [
          { required: true, message: "请输入您的描述", trigger: "blur" },
          { min: 1, max: 1000, message: "长度在 1 到 1000 个字符", trigger: "blur" },
        ],
        plan:[
          { required: true, message: "请输入您的描述", trigger: "blur" },
          { min: 1, max: 1000, message: "长度在 1 到 1000 个字符", trigger: "blur" },
        ],
        gain:[
          { required: true, message: "请输入您的描述", trigger: "blur" },
          { min: 1, max: 1000, message: "长度在 500 到 1000 个字符", trigger: "blur" },
        ],
      },
    };
  },
  methods: {
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },

    apply() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          axios.post("/project/addTeam", {
            team_name: this.ruleForm.team_name,
            leader: this.ruleForm.leader,
            member_1: this.ruleForm.member_1,
            member_2: this.ruleForm.member_2,
            teacher_name:this.ruleForm.teacher_name
          }).then((res) => {
            let r = res.data;
            if (r.flag === true) {
              this.$refs.ruleForm.validate((valid) => {
                if (valid) {
                  axios.post("/project/addPro", {
                    name: this.ruleForm.name,
                    meaning: this.ruleForm.meaning,
                    question: this.ruleForm.question,
                    innovations: this.ruleForm.innovations,
                    plan: this.ruleForm.plan,
                    gain: this.ruleForm.gain,
                    item_id:this.item_id,
                    major_id:this.ruleForm.teacher_major,
                  }).then((res) => {
                    let r = res.data;
                    if (r.flag === true) {
                      alert(r.msg);
                      this.$router.push("/mydeclare");
                    } else {
                      alert(r.msg);
                    }
                  }).catch((err) => {
                    console.log(err);
                  });
                } else {
                  alert("项目申报失败");
                }
              });
            } else {
              alert(r.msg);
            }
          }).catch((err) => {
            console.log(err);
          });
        } else {
          alert("项目申报失败");
        }
      });
    },
  },
  watch: {
    '$route': function () {
      this.item_id = this.$route.params.id;
    }
  },
  mounted() {
    this.item_id = this.$route.params.id;
    console.log(this.item_id)
  },
};
</script>